<template>
    <div class="page">
        <nav-bar title="我的商户" @click-left="$router.back()"></nav-bar>
        <div class="content">
            <div class="con">
                <search v-model="keyWords" show-action placeholder="请输入商户名称或手机号" @search="reload">
                    <template #action>
                        <div @click="reload">搜索</div>
                    </template>
                </search>
                <pullRefresh v-model="refreshing" @refresh="reload">
                    <van-list v-model="loading" :finished="finished" @load="load" finished-text="以上就是全部啦~">
                        <div v-for="cell in list" :key="cell.id" class="cell">
                            <van-cell center :title="cell.code" :label="cell.name" :value="cell.mobilePhone" is-link @click="$refs.storeDetail.show(cell.code)"></van-cell>
                        </div>
                    </van-list>
                </pullRefresh>
            </div>
        </div>
        <StoreDetail ref="storeDetail"></StoreDetail>
    </div>
</template>

<script>
import { PullRefresh, Search } from "vant";
import StoreDetail from "@/moduleS/views/manager/storeDetail"

export default {

    components: { PullRefresh, Search, StoreDetail },

    data() {
        return {
            keyWords: "",
            pageInfo: {
                pageNum: 0,
                pageSize: 20,
            },
            list: [],
            refreshing: false, // 下拉刷新标记
            loading: false,
            finished: false
        }
    },

    // 
    methods: {

        reload() {
            this.pageInfo = {
                pageNum: 0,
                pageSize: 20,
            };
            this.load();
        },

        // 获取账单列表
        load() {
            this.loading = true;
            const params = {
                pageNum: this.pageInfo.pageNum + 1,
                pageSize: this.pageInfo.pageSize,
                keyword: this.keyWords,
            };
            this.$http.serverChild3(params).then(resp => {
                this.loading = false;
                if (resp === false) {
                    return false;
                }
                const { data, pageNum, pageSize, totalCount, totalPages } = resp;
                if (pageNum == 1) {
                    this.list = data;
                } else {
                    Array.prototype.push.apply(this.list, data);
                }
                // 设置分页信息
                this.pageInfo = {
                    pageNum: pageNum,
                    pageSize: pageSize,
                }
                if (totalPages <= pageNum) {
                    this.finished = true;
                } else {
                    this.finished = false;
                }
            });
        },
    },
}
</script>

<style lang="scss" scoped>
</style>